import { Space, Tag } from "antd";
import { ContentProps } from "./data";
import { forwardRef, useState } from "react";
import { ProDescriptions } from "@ant-design/pro-components";
import styles from './descriptionStyles.less';

const Content: React.FC<ContentProps> = (props, uploadRef) => {
  // const [props.checkedKeys, setprops.checkedKeys] = useState<React.Key[]>([]);
  const isLinearMap = new Map([
    [0, 'Rotary'],
    [1, 'Linear'],
  ]);

  const yesOrNoMap = new Map([
    [0, '否'],
    [1, '是'],
  ]);

  const voltageLevelMap = new Map([
    [0, '5V'],
    [1, '13.5-30V'],
  ]);

  const remoteSenseMap = new Map([
    [0, 'Unselect'],
    [1, 'Select'],
  ]);

  const signalMap = new Map([
    [0, 'Unipolar'],
    [1, 'Bipolar'],
  ]);

  const levelMap = new Map([
    [0, 'HTL'],
    [1, 'TTL'],
  ]);

  const transCodeMap = new Map([
    [0, '格雷码'],
    [1, '二进制代码'],
  ]);

  const faultBitActiveMap = new Map([
    [0, 'OFF'],
    [1, '用1个故障位启用'],
  ]);

  const faultLevelMap = new Map([
    [0, '低电平'],
    [1, '高电平'],
  ]);

  return (
    <div>
      <ProDescriptions
        title={<div style={{ fontSize: '14px' }}>基础信息配置</div>}
        style={{ marginTop: '20px' }}
        contentStyle={{ lineHeight: 0.4 }}
        labelStyle={{ lineHeight: 0.4, color: 'grey' }}
        column={4}
        actionRef={props.actionRef}
        request={async() => {
          return Promise.resolve({
            success: true,
            data: {
              isLinearEncoder: isLinearMap.get(props.row.isLinearEncoder),
              isAbsEncoder: yesOrNoMap.get(props.row.isAbsEncoder),
              isMultiAbsEncoder: yesOrNoMap.get(props.row.isMultiAbsEncoder),
              isSsiEncoder: yesOrNoMap.get(props.row.isSsiEncoder),
              voltageLevel: voltageLevelMap.get(props.row.voltageLevel),
              remoteSense: remoteSenseMap.get(props.row.remoteSense),
              signal: signalMap.get(props.row.signal),
              level: levelMap.get(props.row.level),
              gxXist1: props.row.gxXist1,
              gxXist2: props.row.gxXist2,
              singleCircleRes: props.row.singleCircleRes,
              multiCircleRes: props.row.multiCircleRes,
            },
          });
        }}
        columns={[
          {
            title: "线性编码器 P404[1].00",
            key: 'isLinearEncoder',
            dataIndex: 'isLinearEncoder',
          },
          {
            title: "绝对值编码器 P404[1].01",
            key: 'isAbsEncoder',
            dataIndex: 'isAbsEncoder',
          },
          {
            title: "多圈绝对值编码器 P404[1].02",
            key: 'isMultiAbsEncoder',
            dataIndex: 'isMultiAbsEncoder',
          },
          {
            title: "SSI编码器 P404[1].09",
            key: 'isSsiEncoder',
            dataIndex: 'isSsiEncoder',
          },
          {
            title: "电压级24V P404[1].20/P404[1].21",
            key: 'voltageLevel',
            dataIndex: 'voltageLevel',
          },
          {
            title: "遥感仅对SMC30 P404[1].22",
            key: 'remoteSense',
            dataIndex: 'remoteSense',
          },
          {
            title: "信号 P405[0].00",
            key: 'signal',
            dataIndex: 'signal',
          },
          {
            title: "电平 P405[0].01",
            key: 'level',
            dataIndex: 'level',
          },
          {
            title: "编码器精Gx_XIST1 P418[1]",
            key: 'gxXist1',
            dataIndex: 'gxXist1',
          },
          {
            title: "编码器精Gx_XIST2 P419[1]",
            key: 'gxXist2',
            dataIndex: 'gxXist2',
          },
          {
            title: "绝对值编码器单圈 P423[1]/P408[1]",
            key: 'singleCircleRes',
            dataIndex: 'singleCircleRes',
          },
          {
            title: "绝对值编码器多圈 P421[1]",
            key: 'multiCircleRes',
            dataIndex: 'multiCircleRes',
          },
        ]}
      ></ProDescriptions>
      <ProDescriptions
        title={<div style={{ color: 'CornflowerBlue', fontSize: '14px' }}>SSI编码器设置</div>}
        // style={{ marginTop: '22px' }}
        contentStyle={{ lineHeight: 0.4 }}
        labelStyle={{ lineHeight: 0.4, color: 'grey' }}
        column={6}
        actionRef={props.actionRef}
        request={async() => {
          return Promise.resolve({
            success: true,
            data: {
              transCode: transCodeMap.get(props.row.transCode),
              resolution: props.row.resolution,
              ssiAbs: props.row.ssiAbs,
              ssiBefore: props.row.ssiBefore,
              ssiAfter: props.row.ssiAfter,
              baudRate: props.row.baudRate,
            },
          });
        }}
        columns={[
          {
            title: "传输代码 P429[1].00",
            key: 'transCode',
            dataIndex: 'transCode',
          },
          {
            title: "分辨率 P407[1]",
            key: 'resolution',
            dataIndex: 'resolution',
          },
          {
            title: "编码器绝对值位 P447[1]",
            key: 'ssiAbs',
            dataIndex: 'ssiAbs',
          },
          {
            title: "编码器之前的位 P446[1]",
            key: 'ssiBefore',
            dataIndex: 'ssiBefore',
          },
          {
            title: "编码器之后的位 P448[1]",
            key: 'ssiAfter',
            dataIndex: 'ssiAfter',
          },
          {
            title: "波特率 P427[1]",
            key: 'baudRate',
            dataIndex: 'baudRate',
          },

        ]}
      ></ProDescriptions>
      <ProDescriptions
        title={<div style={{ color: 'LightSlateGray', fontSize: '14px' }}>SSI故障位设置</div>}
        // style={{ marginTop: '22px' }}
        contentStyle={{ lineHeight: 0.4 }}
        labelStyle={{ lineHeight: 0.4, color: 'grey' }}
        column={6}
        actionRef={props.actionRef}
        request={async() => {
          return Promise.resolve({
            success: true,
            data: {
              faultBitActive: faultBitActiveMap.get(props.row.faultBitActive),
              faultLevel: faultLevelMap.get(props.row.faultLevel),
              faultPos: props.row.faultPos,
            },
          });
        }}
        columns={[
          {
            title: "故障位激活",
            key: 'faultBitActive',
            dataIndex: 'faultBitActive',
          },
          {
            title: "故障电平",
            key: 'faultLevel',
            dataIndex: 'faultLevel',
          },
          {
            title: "故障位的位置",
            key: 'faultPos',
            dataIndex: 'faultPos',
          },

        ]}
      ></ProDescriptions>
    </div>
  );
};

const EncoderContent = forwardRef<unknown, ContentProps>(Content);

export default EncoderContent;